
import React,{ Component } from 'react';
import { TimePicker,Button } from 'antd';
import moment from 'moment';

class Time extends Component {
    constructor(props) {
        super(props);
        this.state = {
            value: '',
            open: false,
        }
    }
    //点击TimePicker，然后在浮层中选择或者输入某一时间。
    pickerChange(time,timeString) {
        //得到一个对象
        console.log('time',time);
        //得到具体的时间
        console.log('timeString',timeString);
        this.setState({
            value: time,

        },()=>{
            console.log('value',this.state.value);
        })
    }

    openChange(open) {
        this.setState({
            open,
        })
    }
    handleCloseEvent(){
        console.log('关闭',this);
        this.setState({
            open: false,
        })
    }

    render() {
        return (
            <div>
                {/*<TimePicker*/}
                    {/*onChange={ this.pickerChange.bind(this)}*/}
                    {/*defaultOpenValue = { moment('00:00:00','HH:mm:ss')}*/}
                    {/*value = { this.state.value }*/}
                    {/*size = 'small'*/}
                {/*/>*/}
                <TimePicker
                    use12Hours
                    format="h:mm:ss a"
                    open = { this.state.open }
                    onOpenChange={ (e)=> this.openChange(e)}
                    addon = {()=> (
                        <Button size="small" type="primary" onClick={ ()=> this.handleCloseEvent() }>
                            ok
                        </Button>
                    )}
                />
                {/*<TimePicker*/}
                    {/*onChange={ this.pickerChange.bind(this)}*/}
                    {/*size = 'large'*/}
                    {/*disabled*/}
                {/*/>*/}
            </div>
        )
    }
}
export default Time;